<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		
		<div>debounce:<input type="text" id="debounce-input" /></div>
		<script>
		const inputDom = document.getElementById('debounce-input')
		
		function debounce(func, wait) {
		  let timeout
		  return function () {
		    const that = this // 改变执行函数内部 this 的指向
		    const args = arguments // 解决 doSomeThing event指向问题
		    clearTimeout(timeout)
		    timeout = setTimeout(function () {
		      func.apply(that, args)
		    }, wait)
		  }
		}
		
		function doSomeThing(e) {
		  // console.log('我是防抖～～～')
		  console.log("发送请求查询输入框里面的内容")
		  // console.log(e)
		  // console.log(this);
		  // 可能会做 回调 或者 ajax 请求
		}
		
		// inputDom.onkeyup = debounce(doSomeThing, 300)
		// inputDom.oninput = doSomeThing
		inputDom.oninput = debounce(doSomeThing,300)
		</script>
	</body>
</html>
